<template>
  <div>
    <img :src="$pre+info.img" alt="">
    <div>name:{{info.goodsname}}</div>
    <div>price:{{info.price}}</div>
    <div v-html="info.description"></div>
     <v-button @click="$router.push('/index/shop')">前往购物车</v-button>
    <v-button @click="addShop">加入购物车</v-button>
  </div>
  
</template>

<script>
import axios from "axios"
export default {
  data(){
    return {
      // 1.初始化数据 
      info:{}
    }
  },
  mounted(){
    // 2.请求数据 
    axios({
      url:"/api/getgoodsinfo",
      method:"get",
      params:{
        id:this.$route.params.id
      }
    }).then(res=>{
      console.log(res);
      this.info=res.data.list[0]
      // 规格的属性值
      this.info.specsattr=this.info.specsattr.split(",")
    })
  },methods:{
  // 加入购物车车
  addShop(){
    axios({
      url:"/api/cartadd",
      method:"post",
      data:{
        uid:JSON.parse(localStorage.getItem("isLogin")).uid,
        goodsid:this.$route.params.id,
        num:1
      },
      headers:{
        authorization:JSON.parse(localStorage.getItem("isLogin")).token
      }
    }).then(res=>{

      if(res.data.code==200){
        alert(res.data.msg)
      }else{
        alert(res.data.msg)
      }
    })
  }
}
}
</script>

<style lang="less" scoped>
@import "../../less/index.less";
img {
  width: 100vw;
}
</style>